import 'package:flutter/material.dart';
import 'package:getwidget/getwidget.dart';

import 'login.style.dart' as style;
import 'package:comics/constants/images.dart' as imagesConstants;

class Login extends StatefulWidget {
  const Login({Key? key}) : super(key: key);

  @override
  State<StatefulWidget> createState() {
    return _LoginState();
  }
}

class _LoginState extends State<Login> {
  TextEditingController _usernameController = TextEditingController();

  TextEditingController _passwordController = TextEditingController();

  GlobalKey _formKey = GlobalKey<FormState>();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        backgroundColor: Color(0xF5F2F3F5),
        body: SingleChildScrollView(
          child: Column(children: [
            // 标题
            Stack(
              children: [
                Positioned(
                  left: 0,
                  top: 0,
                  bottom: 0,
                  child: Container(
                      width: 100,
                      decoration: BoxDecoration(
                        image: DecorationImage(
                          image: NetworkImage(imagesConstants.LOGIN_LEFT),
                          fit: BoxFit.cover,
                        ),
                      )),
                ),
                Positioned(
                  right: 0,
                  top: 0,
                  bottom: 0,
                  child: Container(
                      width: 100,
                      decoration: BoxDecoration(
                        image: DecorationImage(
                          image: NetworkImage(imagesConstants.LOGIN_RIGHT),
                          fit: BoxFit.cover,
                        ),
                      )),
                ),
                Center(
                  child: Padding(
                      padding: EdgeInsets.only(top: 20, bottom: 20),
                      child: Text(
                        "画中画登录",
                        style: style.title,
                      )),
                )
              ],
            ),

            // 表单
            Container(
              decoration: BoxDecoration(
                color: Colors.white,
              ),
              child: Form(
                  key: _formKey,
                  child: Column(
                    children: [
                      Container(
                        // 上边框
                        decoration: BoxDecoration(
                            border: Border(
                                top: BorderSide(
                                    color: Color(0xFFEFEFEF), width: 1))),
                        child: Center(
                          child: Padding(
                            padding:
                                EdgeInsets.only(top: 5, left: 20, right: 20),
                            child: TextFormField(
                              autofocus: false,
                              controller: _usernameController,
                              decoration: InputDecoration(
                                  hintText: "用户名或邮箱",
                                  border: InputBorder.none,
                                  floatingLabelBehavior:
                                      FloatingLabelBehavior.never),
                            ),
                          ),
                        ),
                      ),
                      Container(
                        decoration: BoxDecoration(
                            border: Border(
                                top: BorderSide(
                                    color: Color(0xFFEFEFEF), width: 1),
                                bottom: BorderSide(
                                    color: Color(0xFFEFEFEF), width: 1))),
                        child: Padding(
                          padding: EdgeInsets.only(
                              top: 5, left: 20, right: 20, bottom: 0),
                          child: TextFormField(
                            autofocus: false,
                            controller: _passwordController,
                            decoration: InputDecoration(
                                hintText: "请输入密码",
                                border: InputBorder.none,
                                floatingLabelBehavior:
                                    FloatingLabelBehavior.never),
                          ),
                        ),
                      ),
                      Padding(
                        padding: EdgeInsets.only(top: 10, bottom: 10, left: 20, right: 20),
                        child: SizedBox(
                          width: double.infinity,
                          child: GFButton(
                            onPressed: () {},
                            text: '登录',
                            shape: GFButtonShape.pills,
                          ),
                        ),
                      ),
                    ],
                  )),
            )
          ]),
        ));
  }
}
